<template>
	<div>
		<div class="smp-search smp_panel">
			<div class="smp_panel_header">
				<div class="smp_panel_pre"></div>
				<div class="smp_panel_title">转派审批</div>
			</div>
			<div class="smp_panel_body">
				
		<processBase :row="row"></processBase>

		<div class="innerTabs">
			<el-tabs>
				<el-tab-pane label="工单信息">
					<processDetails  ref="processDetails" :row="row"></processDetails>
					
					<div class="smp-result smp_panel_1">
						<div class="smp_panel_header">
							<div class="smp_panel_pre"></div>
							<div class="smp_panel_title">流程审批</div>
							<div class="smp-panel_option">
							</div>
						</div>
						
					<div class="smp_panel_body">
						
						<div class="serviceInfo" style="text-align: center;">
							<el-form :inline="false" label-width="85px" size="mini" ref="form" :model="form">
								<el-row>
									<el-col :span="6">
										<span>
											转派申请人：{{task.developmentUserId|getUserChinesName}}
										</span>
									</el-col>
									
									<el-col :span="6">
										<span>
											开发人员：{{task.newDevelopmentUserId|getUserChinesName}}
										</span>
									</el-col>
									
									<el-col :span="12">
										<span>
											转派理由：{{task.resultMessage}}
										</span>
									</el-col>
								</el-row>
							</el-form>		
									
						</div>
						<el-form :inline="false" label-width="85px" size="mini" ref="form" :model="form" :rules="rules">
									
							<el-row>
									
									<el-col :span="24">
										<el-form-item label="处理意见:" prop="resultMessage" >
											<el-input v-model="form.resultMessage" type="textarea"></el-input>
										</el-form-item>
									</el-col>
									
									<el-col :span="24">
										<el-form-item style="text-align: center;">
											<el-button size="mini" type="success" style="width: 150px;"
												@click="onSubmit" plain><i class="el-icon-check"></i> 同意</el-button>
												<el-button size="mini" type="warning" style="width: 150px;"
												@click="onReject" plain><i class="el-icon-close"></i> 不同意</el-button>
										</el-form-item>
									</el-col>
							
							</el-row>
						</el-form>
					</div>
					</div>
				</el-tab-pane>
				<el-tab-pane label="流程信息">
				<processView :row="row"></processView>
				</el-tab-pane>
				<el-tab-pane label="转派审批">
					<div class="smp-search">
						
						<div class="serviceInfo" style="margin-left: 30px;">
							<el-form :inline="false" label-width="100px" size="mini" ref="form" :model="form">
								<el-row>
									<el-col :span="4">
										<span>
											转派申请人：{{task.developmentUserId|getUserChinesName}}
										</span>
									</el-col>
									
									<el-col :span="4">
										<span>
											开发人员：{{task.newDevelopmentUserId|getUserChinesName}}
										</span>
									</el-col>
									
									<el-col :span="16">
										<span>
											转派理由：{{task.resultMessage}}
										</span>
									</el-col>
								</el-row>
							</el-form>		
									
						</div>
							<el-divider content-position="left" />
						<el-form :inline="false" label-width="100px" size="mini" ref="form" :model="form" :rules="rules">
				
							<el-row>
									
									<el-col :span="24">
										<el-form-item label="处理意见:" prop="resultMessage" >
											<el-input v-model="form.resultMessage" type="textarea"></el-input>
										</el-form-item>
									</el-col>
									
									<el-col :span="24">
										<el-form-item style="text-align: center;">
											<el-button size="mini" type="primary"  plain
												@click="onSubmit">同意</el-button>
												<el-button size="mini" 
													@click="onReject">不同意</el-button>
										</el-form-item>
									</el-col>
							
							</el-row>
						</el-form>
					</div>
				</el-tab-pane>
				
			</el-tabs>
		</div>
		
		</div>
		</div>
	</div>
</template>

<script>
	"use strict";
	import {
		reassignment,getTaskReassignment
	} from '@/api/process.js';
	import processBase from '../processCommon/processBase.vue';
	import processView from '../processCommon/processView.vue'
	import processDetails from '../processCommon/processDetails.vue';
	export default {
		data() {
			return {
				row: {},
				task:{},
				form: {
					applyId:'',
					taskId:'',
					developmentUserId: "",
					status: "",
					resultCode: "",
					resultMessage: "同意",
				},
				rules: {
					resultMessage: [{
						required: true,
						message: "处理意见不能为空",
						trigger: ['blur', 'change']
					}]
				},
			};
		},
		created() {
		
			this.row = this.$route.query;
			this.form.taskId = this.row.taskId;
			this.form.applyId=this.row.sid
			this.getTask();
			//this.getNum();
		},
		
		components: {
			processBase,
			processView,
			processDetails
		},
		methods: {
			/**
			 * 受理
			 */
			onSubmit() {
				this.form.status = '6';
				this.$refs["form"].validate(valid => {
					if (valid) {
						reassignment(this.form).then(response => {
								if(response.data.code == "0000"){
									this.$message.success(response.data.message);
								}else{
									this.$message.error(response.data.message);
								}
								
								this.$store.dispatch("updateTaskNum").then(()=>{
									let panel = {key:this.$route.path};
									this.$store.dispatch('removePanel', panel).then(()=>{
									 this.$router.push({name:'mytask',query:{}})
									})
								})
								
							}).catch(error => {
								this.$message.error(error.message);
							});
					}
				});
				
				
				
			},
			
			//转派
			onReject() {
				this.form.status = '7';
				this.$refs["form"].validate(valid => {
					if (valid) {
						reassignment(this.form).then(response => {
								if(response.data.code == "0000"){
									this.$message.success(response.data.message);
								}else{
									this.$message.error(response.data.message);
								}
								
								this.$store.dispatch("updateTaskNum").then(()=>{
									let panel = {key:this.$route.path};
									 this.$store.dispatch('removePanel', panel).then(()=>{
									this.$router.push({path:'/main/processManage/mytask',query:{}})
									 })
								})
								
							}).catch(error => {
								this.$message.error(error.message);
							});
					}
				});
				
				
			},
			
			//获取转派信息
			getTask(){
				getTaskReassignment({taskId:this.form.taskId}).then(response => {
					this.task = response.data.extend;
				}).catch(error => {
					console.info("失败");
					console.info(error.message);
				});
			}
		},
	};
</script>

<style scoped>
	.detailsTitle {
		color: black;
		font-size: 18px;
		text-align: left;
		margin-top: 10px;
		margin-left: 20px;
		margin-bottom: 10PX;
		border-left: 3px solid #090;
		line-height: 24px;
		padding-left: 10px;
		color: #57595d;
	}

	.serviceInfo1 {
		margin-left: 20px;
	}
	

	.serviceInfo {
		text-align: left;
		margin-left: 40px;
		margin-right: 40px;
	}

	.serviceInfo span {
		line-height: 30px;
		text-align: left;
		color: #606266;
		font-size: 14px;
	}

	.el-divider--horizontal {
		margin: 12px 0;
		;
	}
	.smp-result{
		text-align: left;
		margin-left: 0px;
	}
</style>
